fix: display "No images available" message and improve loading indicator handling in FeedScreen #290
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Added a check in the FeedScreen to display a "No images available" message when no posts are returned. This prevents the loading spinner from appearing indefinitely and improves user clarity.
…ests Added a helper function `setFeedScreenContent` to simplify test setup by allowing dynamic initialization of `initialNearbyPosts`. This ensures consistent test configurations and reduces redundant code.
…reen Added a test to verify that the "No images available" message is displayed when there are no posts in the feed and location is available. This ensures the UI handles empty states gracefully. - Mocked location permissions and location provider. - Verified the correct UI message is shown for an empty post list.
Added a test to verify that the loading indicator is displayed when the user's location is still being fetched. This ensures the UI shows a loading state appropriately before location data is available. - Mocked location provider to emit null location values. - Verified that the CircularProgressIndicator is displayed.
…Screen Changed the test tag for the loading indicator in FeedScreen from a string resource to a hardcoded string. This ensures consistency in UI tests, as using string resources caused test failures due to localization or resource resolution issues.
Added a new string resource `feed_no_images_available` to display a user-friendly message when no images are available in the feed.
Replaced the hardcoded "No images available" text with the new string resource `R.string.feed_no_images_available` in FeedScreen. This ensures better localization support and avoids hardcoded strings in the UI.
Added a drawable resource `no_images_placeholder.png` to visually indicate the empty state in the FeedScreen when no images are available. This enhances the user experience by providing a clear visual cue alongside the text message.
…edScreen Added a PNG placeholder image to be displayed above the "No images available" message when no posts are present in the feed. This enhances the user experience with a visual indicator in addition to the text message. - Updated FeedScreen to display the image above the empty state message. - Added a test tag to the image for UI testing. - Refactored the layout using a Column for proper alignment. This improves the clarity and visual appeal of the empty state in the feed. ng a clear visual cue alongside the text message.
…e in FeedScreen Added a test to verify that the placeholder image and "No images available" message are displayed when the feed has no posts. This ensures the empty state is handled correctly and provides visual feedback to users.
|
othbcq
approved these changes
Dec 18, 2024
Kenzoud
approved these changes
Dec 18, 2024
There was a problem hiding this comment.
Great work on addressing the loading state issue in the FeedScreen! The addition of the 'No images available' message and placeholder image are a great improvement for the UX, and the placeholder image is a fun touch haha. I also appreciate the introduction of the TestLocationProvider for better test maintainability. Everything works well, and the implementation is clean. Approved for merge!
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description:
This PR addresses the issue where the FeedScreen keeps showing a loading state indefinitely when there are no images available in the database. It improves the user experience by displaying an appropriate message, adding a visual placeholder image, stabilizing tests, and introducing a reusable test utility for location handling.
Changes:
1. Display "No images available" Message:
feed_no_images_availablefor better localization.feed_no_images_available) to ensure the message can be validated in UI tests.2. Add Placeholder Image:
no_images_placeholder.pngto visually represent the empty feed state.no_images_placeholder) to enable UI testing of the image.3. Fixed Loading Indicator Test Tag:
"loading_indicator_test_tag") to ensure test reliability.4. Created TestLocationProvider:
TestLocationProviderclass for manual location mocking in tests.TestLocationProviderin FeedScreen tests to simulate different location states (null location and valid location).5. Tests Added:
This Fix:
TestLocationProvider) for better test setup and maintainability.Issue Reference:
Closes #270.
Checklist:
no_images_placeholder.png) for empty feed state.TestLocationProviderfor testing location states.